{layout name="layout" /}

<style>
    #dialog {
        position: fixed;
        height: 360px;
        width: 600px;
        background: #FFFFFF;
        z-index: 5;
        left: 30%;
        border: 1px solid gray;
        top: 25%;
        display: none;
    }

    #cancel {
        border: 0px none #FFECEC;
        background: #999999;
        color: #FFFFFF;
        padding: 5px 15px;
        position: absolute;
        top: 8px;
        right: 100px;
    }

    #cancel:hover {
        background: #AAAAAA;
    }
</style>

<nav class="breadcrumb">
    <i class="Hui-iconfont">&#xe67f;</i>
    <a href="{:url('admin/index/index')}"> 首页</a>
    <span class="c-gray en">&gt;</span>
    <a href="{:url('admin/article/index')}">文章管理</a>
    <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px"
        href="javascript:location.replace(location.href);" title="刷新">
        <i class="Hui-iconfont">&#xe68f;</i>
    </a>
</nav>

<div class="Hui-article">
    <article class="cl pd-20" style="min-width: 900px;">
        <div class="cl pd-5 bg-1 bk-gray mt-20">
            <span class="l">
                <a href="javascript:void(0);" onclick="del_all()" class="btn btn-danger radius">
                    <i class="Hui-iconfont">&#xe6e2;</i> 批量删除</a>
                <a class="btn btn-primary radius" href="javascript:void(0);" onclick="addArticle()">
                    <i class="Hui-iconfont">&#xe600;</i> 添加文章</a>
                <a class="btn btn-success radius" href="javascript:void(0);" onclick="pushToTopic()">
                    <i class="Hui-iconfont">&#xe600;</i>推送至专题</a>
            </span>
            <span class="select-box inline ml-50">
                <select name="cid" id="cid" class="select">
                    <option value="0" {eq name='cid' value="0" }selected{/eq}>所有栏目</option>
                    {foreach $categoryTree as $value}
                    <option value="{$value.id}" {eq name='cid' value="$value.id" }selected{/eq}>{$value.name}</option>
                    {notempty name="value.child"}
                    {foreach $value.child as $val}
                    <option value="{$val.id}" {eq name='cid' value="$val.id" }selected{/eq}>--{$val.name}</option>
                    {notempty name="val.child"}
                    {foreach $val.child as $vo}
                    <option value="{$vo.id}" {eq name='cid' value="$vo.id" }selected{/eq}>&nbsp;&nbsp;└ --{$vo.name}
                    </option>
                    {/foreach}
                    {/notempty}
                    {/foreach}
                    {/notempty}
                    {/foreach}
                </select>
            </span>
            <input class="input-text" type="text" name="key" id="key" value="{$key}" style="width: 300px;">
            <button class="btn btn-success radius" type="button" name="search" id="search">搜索</button>
            <span class="r">共有数据：<strong id="total">{notempty name="list"}{$list->total()}{else/}0{/notempty}</strong>
                条</span>
        </div>
        <div id="edatalist">
            <table class="table table-border table-bordered table-bg">
                <thead>
                    <tr class="text-c">
                        <th width="25px;">
                            <input type="checkbox" name="allcheck" value="">
                        </th>
                        <th width="80px;">ID</th>
                        <th style="min-width: 260px;">标题</th>
                        <th width="240px;">栏目</th>
                        <th width="160px;">发布者</th>
                        <th width="180px;">发布时间</th>
                        <th width="140px;">点击量</th>
                        <th width="200px;">操作</th>
                    </tr>
                </thead>
                <tbody>
                    {foreach $list as $val}
                    <tr class="text-c va-m">
                        <td>
                            <input type="checkbox" value="{$val.id}" name="checkbox[]">
                        </td>
                        <td>{$val.id}</td>
                        <td class="text-l">
                            <a href="{$val.create_time|date='Y-m-d'}/{$val.id}.html"
                                target="_blank" style="text-decoration:none" title="浏览">{$val.title}</a>
                        </td>
                        <td>{$categories[$val.cid]}</td>
                        <td>{$val.username}</td>
                        <td>{$val.create_time|date="Y-m-d H:i:s"}</td>
                        <td>{$val.clicks}</td>
                        <td class="td-manage">
                            <a href="{:url('article/info', ['cid'=>$val.cid,'id'=>$val.id])}" title="编辑"
                                style="text-decoration:none" class="ml-10">
                                <i class="Hui-iconfont">&#xe6df;</i>
                            </a>
                            <a href="javascript:;" title="删除" style="text-decoration:none" class="ml-10"
                                onClick="del(this,'{$val.id}')">
                                <i class="Hui-iconfont">&#xe6e2;</i>
                            </a>
                        </td>
                    </tr>
                    {/foreach}
                </tbody>
            </table>
        </div>
        <div class="cl pd-5 bg-1 bk-gray mt-20 ">
            <span class="r">{notempty name="list"}{$list->render()|raw}{/notempty}</span>
        </div>
    </article>

    <!-- 推送至专题 -->
    <div id="dialog">
        <div style="position: absolute;height: 40px;width: 100%;background: #FFFFFF;border-bottom: 1px solid gray;">
            <span style="position: absolute;left: 10px;top: 10px;color: gray;" class="dialog-tilte">推送至专题</span>
            <img src="/static/admin/images/close.png"
                style="height: 25px;width: 25px;position: absolute;right: 10px;top: 10px;cursor: pointer;"
                onclick="f_cancel()" />
        </div>
        <div class="tab" style="margin-left:30px;margin-top:40px;">
            <form id="form-push-topic" method="post" action="">
                <div class="row cl" style="margin-top:20px;">
                    <div class="formControls">
                        推送信息ID: <span class="c-red adis"></span>
                    </div>
                    <div class="col-3"> </div>
                </div>
                <div class="row cl" style="margin-top:10px;">
                    <div class="formControls">
                        <span class="c-red">*</span>图片地址列表,一张图片一行
                    </div>
                    <div class="col-3"> </div>
                </div>
                <div class="row cl" style="margin-top:10px;">
                    <div class="formControls">
                        <textarea class="textarea" style="width: 580px;height: 160px;text-align: left;" name="url_file"
                            id="url_file"></textarea>
                    </div>
                    <div class="col-3"> </div>
                </div>
                <div class="row cl" style="margin-top:10px;">
                    <div class="formControls col-sm-6 col-xs-8 col-sm-offset-4 col-xs-offset-4">
                        <button type="button" class="btn btn-success radius" onclick="topicInfoSave()">推送</button>
                    </div>
                </div>
            </form>
        </div>
    </div>

</div>
<script>
    $("#cid").change(function () {
        var cid = $("#cid").val();

        if (cid) {
            window.location.href = '/admin/article/index.html?cid=' + cid;
        } else {
            window.location.href = '/admin/article/index.html';
        }
        return false;
    })

    $("#search").click(function () {
        var cid = $("#cid").val();
        var key = $("#key").val();

        window.location.href = "/admin/article/index?cid=" + cid + "&key=" + key;
    })

    function addArticle() {
        var cid = $("#sel_option").val();
        // console.log(cid);
        // return false;
        if (!cid || cid == 0) {
            layer.msg("请选择栏目", {
                icon: 5,
                time: 2000
            });
            return false;
        }
        window.location.href = '/admin/article/info/cid/' + cid + '.html';
    }

    function del_all() {
        var checkbox = $('.text-c input[name="checkbox[]"]');
        var ids = new Array();
        checkbox.each(function (x) {
            if (this.checked)
                ids.push(this.value);
        })
        // console.log(ids);
        if (ids.length < 1) {
            layer.msg("请选择文章id", {
                icon: 5,
                time: 1500
            });
        }

        layer.confirm('确认要删除吗？', function (index) {
            $.post('delete', {
                'id': ids
            }, function (data) {
                if (data.code == 1) {
                    layer.msg(data.msg, {
                        icon: 1,
                        time: 1000
                    }, function () {
                        checkbox.each(function (x) {
                            if (this.checked)
                                $(this).parents("tr").remove();
                        })
                        // window.location.reload();
                    });
                } else {
                    layer.msg(data.msg, {
                        icon: 5,
                        time: 1000
                    });
                }
            }, 'json')
        });
    }

    function pushToTopic() {
        var checkbox = $('.text-c input[name="checkbox[]"]');
        var ids = new Array();
        checkbox.each(function (x) {
            if (this.checked)
                ids.push(this.value);
        })
        // console.log(ids);
        if (ids.length < 1) {
            layer.msg("请选择文章id", {
                icon: 5,
                time: 1500
            });
            return false;
        }

        layer_show('推送至专题', '/admin/topic_info/pushInfo?aids=' + ids, null, 500);

        // $(".adis").html(ids.join());

        // showDialog();
    }

    // 隐藏弹窗
    function f_cancel() {
        $("#form-push-topic")[0].reset();
        $('#dialog').hide();
    }
    //显示弹窗
    function showDialog() {
        $('#dialog').show();
    }

</script>